<template>
    <van-sticky>
        <van-row justify="space-between" align="center" id="app-header">
            <van-col span="12">
                <van-icon name="bars" size="30" @click="menuClick" />
                <h1>H3C</h1>
            </van-col>

            <van-col span="6">
                <span>
                    <van-icon name="add" size="20px" />|
                </span>
                <span>
                    <van-icon name="friends" size="20px" />
                </span>
            </van-col>
        </van-row>
    </van-sticky>
</template>

<script setup>
import { ref, getCurrentInstance, inject } from 'vue';
const menuShow = inject('menuShow') // 接受父组件传值

const menuClick = () => {
    menuShow.value = !menuShow.value;
}
</script>

<style scoped>
#app-header {
    background-color: rgba(0, 150, 213, 1);
    color: white;
}
#app-header h1 {
    padding: 0;
    margin: 0;
    display: inline-block;
    font-size: 30px;
    font-weight: bold;
}
</style>